@keyframes scaleInOut {
  0% {
    //display: none;
    opacity: 0;
    transform: scale(0);
    -webkit-transform: scale(0);
  }
  100% {
    //display: block;
    opacity: 1;
    transform: scale(1);
    -webkit-transform: scale(1);
  }
}

@-webkit-keyframes scaleInOut {
  0% {
    opacity: 1;
    transform: scale(1);
    -webkit-transform: scale(1);
    //display: block;
  }
  100% {
    opacity: 0;
    transform: scale(0);
    -webkit-transform: scale(0);
    //display: none;
  }
}

.toast_wrap {
  z-index: 999;
  position: fixed;
  left: 50%;
  bottom: 30%;
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  p {
    background: rgba(0, 0, 0, 0.9);
    color: #fff;
    font-size: 1.3rem;
    padding: 0.6rem 1.6rem;
    -webkit-border-radius: 4px;
    border-radius: 4px;
  }
  .scaleIn {
    animation: scaleInOut 0.5s forwards;
    -webkit-animation: scaleInOut 0.5s forwards;
  }
  .scaleOut {
    animation: scaleInOut 0.5s forwards;
    -webkit-animation: scaleInOut 0.5s forwards;
    animation-direction: alternate;
  }

}
